<?php
$size = count($distances);
$sidebar =
'<ul id=\"rudolph-nav\">
    <li><a href=\"' . site_url("rudolph_tabelle/$pool/free") . '\">Vabaltujumine</a></li>
    <li><a href=\"' . site_url("rudolph_tabelle/$pool/back") . '\">Seliliujumine</a></li>
    <li><a href=\"' . site_url("rudolph_tabelle/$pool/breast") . '\">Rinnuliujumine</a></li>
    <li><a href=\"' . site_url("rudolph_tabelle/$pool/fly") . '\">Liblikujumine</a></li>
    <li><a href=\"' . site_url("rudolph_tabelle/$pool/medley") . '\">Kompleks</a></li>
</ul>';

$sidebar = str_replace("\n", '\n', $sidebar);

$buttons = '<div class=\"btn-group\" data-toggle=\"buttons-radio\">
  <button id=\"all\" class=\"btn btn-large btn-primary\" data-toggle=\"button\">Kõik</button>
  <button id=\"50\" class=\"btn btn-large\">50 m</button>
</div>';

$buttons = str_replace("\n", '\n', $buttons);

?> 

<style>
    nav.sidebar { 
        left: 0px;
        position: absolute;
    }

    #rudolph-nav {
        top: 0;
    }

    #rudolph-nav.fixed {
        position: fixed;
        top: 0;
        bottom: 0;
        margin: 20px 0px;
    }
    
    .btn-group {
        float: right;
        margin-top: -50px;
    }
</style>

<script>
    
    $(".page-header").html("<h1>Rudolph-Tabelle <small>&copy; Dr. Rudolph Klaus</small></h1><?php echo $buttons; ?>");
    $(".sidebar").html("<?php echo $sidebar; ?>");
    
    $('.btn').click(function() {
        var path = "<?php echo site_url("rudolph_tabelle/all/$stroke") ?>";
        if (String(window.location).indexOf(this.id) == -1) {
            var pool = this.id == 50 ? 'all' : '50'; 
            window.location = path.replace(pool, String(this.id));
        }
    });
    
    // add parser through the tablesorter addParser method 
    $.tablesorter.addParser({ 
        // set a unique id 
        id: 'results', 
        is: function(s) { 
            // return false so this parser is not auto detected 
            return false; 
        }, 
        format: function(s) { 
            // format your data for normalization 
            return result_to_ms(s);
        }, 
        // set type, either numeric or text 
        type: 'numeric' 
    }); 
     
    $(document).ready(function() 
    { 
        $('#<?php echo $pool; ?>').button('toggle');
        
        var top = $('#rudolph-nav').offset().top - parseFloat($('#rudolph-nav').css('marginTop').replace(/auto/, 0));
        var height = (document.height !== undefined) ? document.height : document.body.offsetHeight;
        $(window).scroll(function (event) {
            var y = $(this).scrollTop();
            
            console.log('height: ' + height + ' y: ' + y);
            if (y >= top) {
                $('#rudolph-nav').addClass('fixed');
            } else {
                $('#rudolph-nav').removeClass('fixed');
            }
        });
        $(".tablesorter").tablesorter({ 
            headers: { 
                <?php
                for ($i = 0; $i < $size; $i++) {
                    $header = $i + 3;
                    echo "$header: {sorter:'results'},";
                }
                ?>
            } 
        }); 
    } 
); 
</script>

<table class="table rudolph-legend">
    <thead>
        <tr>
            <th>Legend</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>Maailma tase</th>
            <?php
            for ($i = 20; $i >= 17; $i--) {
                echo "<td class=\"rudolph-$i\">$i p</td>";
            }
            ?>
        </tr>
        <tr>
            <th>Kõrg tase</th><td class="rudolph-16">16 p</td><td class="rudolph-15">15 p</td>
        </tr>
        <tr>
            <th>Regionaalne tase</th>
            <?php
            for ($i = 14; $i >= 5; $i--) {
                echo "<td class=\"rudolph-$i\">$i p</td>";
            }
            ?>
        </tr>
        <tr>
            <th>Nõrk tase</th>
            <?php
            for ($i = 4; $i >= 1; $i--) {
                echo "<td class=\"rudolph-$i\">$i p</td>";
            }
            ?>
        </tr>
    </tbody>
</table>

<table class="table rudolph tablesorter">
    <thead>
        <tr>
            <th>#</th>
            <th>Nimi</th>
            <th>Vanus</th>

            <?php
            foreach ($distances as $key => $value) {
                echo '<th class="text-center">' . $key . ' m</th>';
            }
            ?>
        </tr>

    </thead>
    <tbody>

        <?php
        $nr = 1;
        foreach ($values as $key => $row) {
            echo '<tr>';
            echo "<td>$nr</td>";
            echo '<td>' . $row['last_name'] . ', ' . $row['first_name'] . '</td>';
            echo '<td>' . $row['age'] . '</td>';
            for ($i = 0; $i < $size; $i++) {
                if (isset($row[$i])) {
                    echo '<td class="text-center rudolph-' . $row[$i]['points'] . '">' . $row[$i]['result'] . '</td>';
                } else {
                    echo '<td></td>';
                }
            }
            echo '</tr>';
            $nr++;
        }
        ?>

    </tbody>

</table>